Exercícios/Exercício 22/index.html

<!DOCTYPE html>
<html lang="pt-br">
    <head>
        <meta charset="UTF-8">
        <meta name="description" content="Exercício 22 - Jovens Tegranos - Etapa de Nivelamento">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <link rel="stylesheet" href="../style.css">
        <title>Exercício 22</title>
    </head>
    <body>
        <div id="divInputs">
            <span id="titulo">Exercício 22</span>
            <p id="enunciado">Ler um número inteiro N, daí mostrar na tela a tabuada de N para 1 a 10,
                conforme exemplo.</p>
            
            <details>
                <summary>
                    Exemplo
                </summary>
                <div id="divExemplo">Deseja a tabuada para qual valor? <span class="inputTexto">4</span><br>
                    4 x 1 = 4<br>
                    4 x 2 = 8<br>
                    4 x 3 = 12<br>
                    4 x 4 = 16<br>
                    4 x 5 = 20<br>
                    4 x 6 = 24<br>
                    4 x 7 = 28<br>
                    4 x 8 = 32<br>
                    4 x 9 = 36<br>
                    4 x 10 = 40
                </div>
            </details>
            
            <div id="formInputs">
                <label for="inputValorN">Deseja a tabuado para qual valor? </label>
                <input class="input" id="inputValorN"></input>
            </div>
            <div id="button" class="button">Enviar</div>
            
            <div id="pageBDiv">
                <a class="button" href="../Exercício 21/index.html">Anterior</a>
                <a class="button" href="../Exercício 23/index.html">Próximo</a>
            </div>
            <script src="./script.js"></script>
        </div>
        <div id="divOutputs">
            <label for="outputArea" style="font-weight: bold;">Saída:</label>
            <textarea id="outputArea" readonly></textarea>
        </div>
    </body>
</html>